<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet"  href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="css/lrtk.css"/>

	</head>

	<body>

	    <!--main-->
	    <div class="luandou_main">
	        
	    	<div id="luandourole" class="luandou_role"> 
	    		<div>
	    			<ul class="list">
	    				<li><strong>规则</strong></li>
	    				<li>两张图片，猜猜看哪张魅力更高，所猜的那张图片魅力增加一点</li>
	    				<li>猜对自己增加一魅力豆，猜错自己减少一魅力豆。</li>
	    				<li>一元为100魅力豆</li>
	    				<li>每天可领取20魅力豆</li>
	    				<li>赠送鲜花消耗10魅力豆，可查看图片信息，可能会有联系方式。</li>
	    				<li>每10魅力豆可以购买1魅力值，魅力值可以给自己的图片增加魅力值。</li>
	    				<li>鲜花榜和魅力榜</li>
	    			</ul>
	    		</div>
	    		<div>
	    			<button type="button" id="luandou_start" class="mui-btn mui-btn-blue mui-btn-block">乱斗开始</button>
	    		</div>  
	    	</div>
	    	<div id="luandou_main" class="luandou_cont" style="display: none;">
	    		<!--<div id="luandou_single">
	    		    <div class="luandou_co">
	    		        <div class="luandou_pk">
	    		        	pk
	    		        </div>
	    		    	<div class="img_top">
	    		    	    <span class="luandou_tap">好</span>
                            <div class="img_cont">
                                <a class="example2" title="" href="images/images/image01.png"><img src="images/images/image01.png" /></a>
                            </div>
                            <div class="img_info">
                                
                            </div>
                         </div>
                         <div class="img_botm">
                             <span class="luandou_tap">好</span>
                             <div class="img_info">
                                
                            </div>
                            <div class="img_cont">
                                <a class="example2" title="" href="images/upload/123456/1479092245.jpg"><img src="images/upload/123456/1479092245.jpg" /></a>
                            </div>
                         </div>
	    		    </div>
	    			 
	    			 <div class="img_result">
	    			 	
	    			 </div>
	    		</div>-->
	    		
	    		<div class="luandou_next_cont">
	    			<button id="luandou_next_btn" type="button" class="mui-btn mui-btn-blue mui-btn-block">下一个</button>
	    		</div>
	    		
	    	</div>
	    	
	    	
	    </div>
	     
        <!--<script src="js/jquery-1.11.0.min.js"></script>-->
        <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	    <script src="js/mui.min.js"></script>
	    <script src="js/app.js"></script>
	    <script src="js/jquery.imgbox.pack.js" type="text/javascript" charset="utf-8"></script>
	    <script src="js/myajax.js" type="text/javascript" charset="utf-8"></script>
	    
	    
	    <script type="text/javascript">
	    	function imgboxinit (){
	    	    jQuery(".example2").imgbox({
                    'speedIn'       : 0,
                    'speedOut'      : 0,
                    'alignment'     : 'center',
                    'overlayShow'   : true,
                    'allowMultiple' : false
                });
	    	};
	    </script>
	    
	    <script>
            (function($, doc) {
                
                $.init(); 
                $.plusReady(function() {
                    plus.screen.lockOrientation("portrait-primary");
                    
                    
                    var obj_luandou = [];
                    $(document).on("tap","#luandou_start",function(){
                        
                        var $role = jQuery("#luandourole");
                        var $cons = jQuery("#luandou_main");
                        
                        $role.hide();
                        $cons.show(500);

                     });
                     
                     
                      var luandouinfo = {"ajaxnum":"10"};
                       myajax.getluandouinfo(luandouinfo,function(data){
//                         alert("第一次加载");
                           if(data[0].id){
                               obj_luandou = data;
                               var btn = document.getElementById("luandou_next_btn");
                                mui.trigger(btn,'tap');//事件触发
//                              obj_luandou.splice(0,2);
                           }else{
                            alert(data); 
                            return;
                        }
                           
                       });
                     
                    
                     
                     
                     $(doc).on("tap","#luandou_next_btn",function(){
//                       alert("点击");
                          jQuery(this).attr("disabled","disabled");

                          var array_length = obj_luandou.length;
                          
                          if(array_length<2){
//                            alert("加载更多");
                              obj_luandou = [];
                              myajax.getluandouinfo(luandouinfo,function(data){
                                   if(data[0].id){

                                       jQuery("#luandou_next_btn").removeAttr("disabled"); 
                                       obj_luandou = data;
                                       var btn = document.getElementById("luandou_next_btn");
                                        mui.trigger(btn,'tap');//事件触发
 
                                   }else{
                                    alert(data); 
                                    return;
                                }
                                   
                               });
                              
                              
                          }else{
                              setTimeout(function(){
                                jQuery("#luandou_next_btn").removeAttr("disabled");  
                              },1000);
                              var imgi0 = obj_luandou[0].address.substring(3);
                              var imgi1 = obj_luandou[1].address.substring(3);
                              var luandou_sing = '<div id="luandou_single">\
                                                    <div class="luandou_co">\
                                                        <div class="luandou_pk">PK</div>\
                                                        <div class="img_top">\
                                                            <span class="luandou_tap" data-id="'+obj_luandou[0].id+'">好</span>\
                                                            <div class="img_cont">\
                                                                <a class="example2" title="" href="'+imgi0+'"><img src="'+imgi0+'" /></a>\
                                                            </div>\
                                                            <div class="img_info" >'+obj_luandou[0].love+'</div>\
                                                         </div>\
                                                         <div class="img_botm">\
                                                             <span class="luandou_tap"  data-id="'+obj_luandou[1].id+'">好</span>\
                                                             <div class="img_info">'+obj_luandou[1].love+'</div>\
                                                            <div class="img_cont">\
                                                                <a class="example2" title="" href="'+imgi1+'"><img src="'+imgi1+'" /></a>\
                                                            </div>\
                                                         </div>\
                                                    </div>\
                                                     <div class="img_result"></div>\
                                                </div>';
                              
                              jQuery("#luandou_single").remove();
                              jQuery("#luandou_main").prepend(luandou_sing);
                              obj_luandou.splice(0,2);
                              imgboxinit();
                          }
   
                     });
                     
                     

                }); 
            }(mui, document)); 
        
        </script>
	    
	    
	</body>

</html>